<!DOCTYPE html>
<html lang="zh-CN">
	<head>
	    <meta charset="utf-8" />
	    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
	    <meta name="viewport" content="width=device-width, initial-scale=1" />
	    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
	    <title>sino-sources外贸综合服务平台</title>
	
	    <!-- Bootstrap -->
	    <link href="css/bootstrap.min.css" rel="stylesheet" />
	    <link href="css/font-awesome.min.css" rel="stylesheet"  />
	    <style>
	    	.side-bar li {
	    		background-color: #f7f7f9;
	    	}
	    	.side-bar {
	    		/*background-color: #f7f7f9;*/
	    		margin-top: 70px;
	    	}
	    </style>
	
	    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
	    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	    <!--[if lt IE 9]>
	      <script src="https://cdn.bootcss.com/html5shiv/3.7.3/html5shiv.min.js"></script>
	      <script src="https://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
	    <![endif]-->
	</head>
	<body>
	    
	    <div id="header"></div>
	    
	    <!--banner-->
	    <img src="img/banner.jpg" width="100%" />
	    
	    <!--主体-->
	    <div class="container">
	    	<div class="row">
		    	<!--侧边栏-->
			    <ul class="nav nav-pills nav-stacked side-bar col-xs-2" id="sideBar">
				    <li role="presentation" class="active"><a class="pageA-index">自助通关</a></li>
				    <li role="presentation"><a class="pageB-index">自助结汇</a></li>
				    <li role="presentation"><a class="pageC-index">自助退税</a></li>
				</ul>
				
				<div class="col-xs-10" id="content">
					
			    </div>
		    </div>
	    	
	    </div>
	    
	    <!--footer-->
	    <div id="footer"></div>
	    
	    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
	    <script src="js/vendor/jquery-2.2.4.min.js"></script>
	    <!-- Include all compiled plugins (below), or include individual files as needed -->
	    <!--<script src="js/vendor/bootstrap.min.js"></script>-->
	    <!--bootstrap验证-->
	    <!--<script src="js/vendor/BootstrapValidator.min.js"></script>-->
	    <script>
	    	$('#header').load('header.html',function(){
	    		
	    		$('.nav li').eq(0).addClass('active').siblings().removeClass('active');
	    		
	    	});
	    	
	    	$('#content').load('pageA-index.html');
	    	
	    	$('#sideBar').on('click','li',function(){
	    		
	    		var pageLink = $(this).find('a').attr('class');
//	    		alert(pageLink);
				$('#content').load(pageLink + '.html');
				$(this).addClass('active').siblings().removeClass('active');
	    		
	    	});
	    	
	    	$('#footer').load('footer.html');
	    </script>
	</body>
</html>
